<%@ page contentType="text/html; charset=utf-8"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %> 
<%@ include file="../../header.jsp"%>
 <link href="<c:out value="${ctx}"/>/pagejs/pagination.css" rel="stylesheet">
<!--引入JS-->
	<script type="text/javascript" src="${ctx }/pagejs/pagination.js"></script>
	<script src="${ctx }/bootstrap/js/number.js"></script>
<meta charset="UTF-8" />
<style>
	*{
		padding:0;
		margin:0;
	}
	.post_img li{
		list-style: none;
		float: left;
		margin-right: 10px;
	}
	
	.control_button{
		margin-bottom: 5px;
	}
	
	.panel-title-style{
		padding:5px;
		overflow:hidden;
		white-space:nowrap;
		text-overflow:ellipsis;
		cursor: pointer;
	}
	
	.input_search{
		float: right;
	}
	
</style>
<script>
$(".mkbanner li:eq(0)").addClass("active");
$(function() {
	var count = parseInt('${count}');
	var currentpage = parseInt('${currentpage }');
	var initPagination = function() {
	$(".pagination").pagination(count, {
	num_edge_entries : 1,
	num_display_entries : 10,
	callback : pageselectCallback,
	items_per_page:10,
	current_page : currentpage
	});
	}();
	
	$('#myTab li:eq(1) a').click(function(){ // get top post
		$.post(ctx+"/post/top",{
			type:1
		},function(result){
			$("#ios").html(result.data);
		});
	});
	
	$('#myTab li:eq(2) a').click(function(){ // get top post
		$.post(ctx+"/post/top",{
			type:2
		},function(result){
			$("#recommended").html(result.data);
		});
	});
	
	$(".glyphicon-thumbs-up").click(function(){
		var id = $(this).parent().parent().attr("data-id");
		promxuse(1,id,$(this));
	});
	
	$(".glyphicon-eye-open").click(function(){
		var id = $(this).parent().parent().attr("data-id");
		promxuse(2,id,$(this));
	});
	
	
	});


	function pageselectCallback(page_index, jq) {
	if ($("#current_page").val() != page_index) {
	$("#current_page").val(page_index);
	$("#form").submit();
	}
	return false;
	}
	
	function markPost(postId){
		$.post(ctx+"/post/mark",{
			postId:postId
		},function(result){
			alert("操作成功");
			window.location.href = location.href;
		});
	}
	
	function deletePost(postId){
		$.post(ctx+"/post/delete",{
			postId:postId
		},function(result){
			alert("操作成功");
			window.location.href = location.href;
		});
	}
	
	function cancelMark(postId){
		$.post(ctx+"/post/cancelMark",{
			postId:postId
		},function(result){
			alert("操作成功");
			window.location.href = location.href;
		});
	}
	
	function readPL(postId){
		window.location.href=ctx+"/post/readPL?postId="+postId;
	}
	
	function postTop(postId,top){
		$.post(ctx+"/post/topPost",{
			postId:postId,
			top:top
		},function(result){
			alert("操作成功");
			window.location.href = location.href;
		});
	}
	
	function promxuse(type,id,obj){
		var number = getTmpNumber();
		$.tipsBox({
			obj: obj,
			str: "+"+number,
            callback: function() {
               $.post(ctx +"/post/prometheus",{
            	   id:id,
            	   type:type,
            	   number:number
               });
            }
		});
	}
	
</script>
<div class="container">
	<div class="row">
		<div class="col-sm-12">
			<ol class="breadcrumb">
		  <li><a href="#">晒单</a></li>
		  <li><a href="#" class="active">晒单列表</a></li>
		</ol>
		</div>
	</div>
	<ul id="myTab" class="nav nav-tabs">
		   <li class="active"><a href="#home" data-toggle="tab">
		      打标/删帖/评论/置顶</a>
		   </li>
	   	   <li><a href="#ios" data-toggle="tab">置顶的帖子</a></li>
	   	   <li><a href="#recommended" data-toggle="tab">推荐的帖子</a></li>
	</ul>
	<div id="myTabContent" class="tab-content">
   		<div class="tab-pane fade in active" id="home">
      		<div id="foot">
	<div class="pagination"></div>
	<div class="input_search">
	<form action="${ctx }/post/listpost" class="form-inline" name="form" id="form" method="post">
	<input type="hidden" class="form-control" id="current_page" name="currentpage" value="${currentpage }" />
	<input type="text" class="form-control" name="description"/>
	 <button type="submit" class="form-control btn btn-default">搜索</button>
	</form>
	</div>
	</div>
	<c:forEach var="bean" items="${list }">
		<div class="row">
			<div class="panel panel-info">
				 <div class="panel-heading">
				      <h3 class="panel-title panel-title-style" title="${bean.description }">${bean.description }</h3>
				 </div>
			 	 <div class="panel-body" style="padding:5px">
						  <ul class="post_img">
						  	<c:forEach items="${bean.imgs }" var="img">
						  		<li><img class="img-responsive" style="width:120px;height:100px;" src="${img.url }"></img></li>
						  	</c:forEach>
						  </ul>
			  	</div>
			  	<div class="panel-body">
			  	<div class="row">
			  		<div class="col-sm-6" style="float:left;" data-id="${bean.id }">
			  		${bean.user.userName } : <fmt:formatDate value="${bean.createtime}" pattern="yyyy-MM-dd HH:mm"/> 
			  		<a><span class="glyphicon glyphicon-thumbs-up" title="赞"></span></a>
		       		<a><span class="glyphicon glyphicon-eye-open" title="阅读"></span></a>
			  		</div>
			  		<div class="col-sm-6" style="float: right;">
			  		 <button type="button" class="btn btn-info" onclick="deletePost('${bean.id}')">删除帖子</button>
			  		 <c:if test="${bean.mark eq 0 }">
			  		 <button type="button" class="btn btn-info" onclick="markPost('${bean.id}')">帖子打标</button>
			  		 </c:if>
			  		 <c:if test="${bean.mark eq 1 }">
			  		 <button type="button" class="btn btn-warning" onclick="cancelMark('${bean.id}')">取消打标</button>
			  		 </c:if>
			  		 <button type="button" class="btn btn-info" onclick="readPL('${bean.id}')">查看评论</button>
			  		 <c:if test="${bean.top eq 0}">
			  		 	<button type="button" class="btn btn-info" onclick="postTop('${bean.id}',1)">置顶帖子</button>
			  		 	<button type="button" class="btn btn-info" onclick="postTop('${bean.id}',2)">推荐帖子</button>
			  		 </c:if>
			  		 <c:if test="${bean.top eq 1}">
			  		 	<button type="button" class="btn btn-info" onclick="postTop('${bean.id}',0)">取消置顶</button>
			  		 </c:if>
			  		</div>
			  		
			  	</div>
			  	</div>
			</div>
		</div>
	</c:forEach>
	<div id="foot">
	<div class="pagination"></div>
	</div>
   		</div>
  		<div class="tab-pane fade" id="ios">
      		
   		</div>
   		<div class="tab-pane fade" id="recommended">
      		
   		</div>
	</div>
</div>